<!--

@description: 寄件服务html

@author: 赖赖

@update: 2021年9月8日15:56:25

 -->

<!DOCTYPE html>
<html lang="en" onselectstart="return false">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="../../../public/HomePageHeadAndFootStyle/HomePageHeadAndFootStyle.css">
    <link rel="stylesheet" href="./MailStyle.css">
    <title>寄件服务</title>
    <!-- 对接接口引用JQ -->
    <script crossorigin="anonymous"
        integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ=="
            src="https://lib.baomitu.com/jquery/3.6.0/jquery.min.js"></script>
</head>

<body>
         <!-- 头部 -->
    <header>
        <!-- 登入接口 -->
        <section class="drjk">
            <!-- 登入主框 -->
            <div class="zk">
                <!-- 左内容 -->
                <div class="dzt">
                    <a href="../WarehouseDistributionServiceView/WarehouseDistributionServiceView.html" target="_blank">仓配服务</a>
                    <a href="../ExpressServiceView/ExpressServiceView.html" target="_blank">快递快运服务</a>
                    <a href="../BulkyItemsServiceView/BulkyItemsServiceView.html" target="_blank">大件服务</a>
                    <a href="../ColdChainServiceView/ColdChainServiceView.html" target="_blank">冷链服务</a>
                    <a href="../CrossBorderServiceView/CrossBorderServiceView.html" target="_blank">跨境服务</a>
                </div>
            </div>
        </section>
        <!-- 导航 -->
        <nav>
            <!-- 导航主框 -->
            <div class="dhzk">
                <!-- 图标 -->
                <div class="logo">
                    <!-- <a href="./HomePageView.html">
                        <img src="../../../other/Egg_img/logo.png" alt="图标">
                        <span>LWL</span>
                    </a> -->
                </div>
                <!-- 导航下拉栏 -->
                <div class="xl clr">
                    <a href="../HomePageView/HomePageView.html">
                        <div class="sy">首页</div>
                        <!-- <h1></h1> -->
                    </a>
                    <a>
                        <div class="wlfu">物流服务
                            <!-- 物流悬浮显示 -->
                            <p>
                                <!-- 服务内容 -->
                                <a href="../WarehouseDistributionServiceView/WarehouseDistributionServiceView.html"
                                    target="blank" class="cp">仓配置服务</a>
                                <a href="../ExpressServiceView/ExpressServiceView.html" target="blank"
                                    class="ky">快递快运服务</a>
                                <a href="../BulkyItemsServiceView/BulkyItemsServiceView.html" target="blank"
                                    class="dj">大件服务</a>
                                <a href="../ColdChainServiceView/ColdChainServiceView.html" target="blank"
                                    class="ll">冷链服务</a>
                                <a href="../CrossBorderServiceView/CrossBorderServiceView.html" target="blank"
                                    class="kf">跨境服务</a>
                            </p>
                        </div>
                    </a>
                    <a href="../AboutUsView/AboutUsView.html" target="blank">
                        <div class="gywm">关于我们</div>
                    </a>
                </div>
            </div>
        </nav>
    </header>
    <!-- 主体 -->
    <main>
        <!-- 标题顶 -->
        <section class="btd">
            <h4>在线下单</h4>
        </section>

        <!-- 信息表单 -->
        <section class="bd">
            <div class="bt">
                <h5>寄快递</h5>
            </div>

            <!-- 表单 -->
            <form>
                <!-- 填写信息 -->
                <section class="xx">
                    <!-- 寄件人 -->
                    <div class="txmk">
                        <h5>寄件人</h5>
                        <div class="jishou">
                            <label><span>*</span>寄件人姓名：<input type="text" placeholder="请输入寄件人姓名" required
                                    autofocus class="j_name" maxlength="15"></label>
                            <!-- 友情提示 -->
                            <section class="j_name_ts ts">请输入寄件人姓名！</section>
                            <label><span>*</span>寄件人电话：<input type="tel" placeholder="请输入寄件人电话" required
                                    maxlength="11" minlength="11" class="j_phone"></label>
                            <!-- 友情提示 -->
                            <section class="j_phone_ts ts">电话号码格式不正确！</section>
                            <label for="j_return_address" class="jj clr"><span>*</span>寄件人地址：</label>
                            <textarea id="j_return_address" placeholder="请输入寄件人地址（100字以内）" cols="30" rows="10"
                                required class="j_address"  maxlength="100"></textarea>
                            <!-- 友情提示 -->
                            <section class="j_address_ts dz_ts">请输入寄件人地址！</section>
                        </div>
                    </div>
                    <!-- 收件人 -->
                    <div class="txmk">
                        <h5>收件人</h5>
                        <div class="jishou">
                            <label><span>*</span>收件人姓名：<input type="text" placeholder="请输入收件人姓名" required
                                    autofocus class="s_name" maxlength="15"></label>
                            <!-- 友情提示 -->
                            <section class="s_name_ts ts">请输入收件人姓名！</section>
                            <label><span>*</span>收件人电话：<input type="tel" placeholder="请输入收件人电话" required
                                    maxlength="11" minlength="11" class="s_phone"></label>
                            <!-- 友情提示 -->
                            <section class="s_phone_ts ts">电话号码格式不正确！</section>
                            <label for="s_return_address" class="jj clr"><span>*</span>收件人地址：</label>
                            <textarea id="s_return_address" placeholder="请输入收件人地址（100字以内）" cols="30" rows="10"
                                required class="s_address" maxlength="100"></textarea>
                            <!-- 友情提示 -->
                            <section class="s_address_ts dz_ts">请输入收件人地址！</section>
                        </div>
                    </div>
                </section>

                <!-- 寄件方式 -->
                <section class="fs">
                    <h5>寄件方式</h5>
                    <div class="jjfs">
                        <span>寄件方式：</span>
                        <span class="qj">上门取件</span>
                    </div>
                    <label>上门时间：<input type="date" placeholder="请输入一个时间" class="sj" id="time"></label>
                    <!-- 友情提示 -->
                    <section class="set_out_ts set_out">请输入上门时间！</section>
                </section>

                <!-- 验证码 -->
                <section class="yzm">
                    <input id="vcode" name="yzm" type="text" maxlength="4" size="4" placeholder="请输入验证码" />
                    <span class="sp" id="code" title="">点击生成</span>
                    <!-- 友情提示 -->
                    <section class="yzm_ts"></section>
                </section>

                <!-- 提交 -->
                <section class="tj">
                    <input type="checkbox" id="yd" class="fxk">
                    <label for="yd" class="tk">我已理解并同意遵守服务条款</label>
                    <button type="button" class="jz" disabled>提交订单</button>
                </section>

            </form>
        </section>
    </main>

     <!-- 底部 -->
     <footer>
        <!-- 底部主体 -->
        <div class="zt">
            <!-- 图标 -->
            <div class="logo2">
                <!-- <img src="../../../other/Egg_img/logo.png" alt="图标">
                <span class="lwl">LWL物流</span> -->
            </div>
            <!-- 分栏 -->
            <nav>
                <!-- 白色链接 -->
                <div class="bslj">
                    <!-- <a href="../AboutUsView/AboutUsView.html" ></a> -->
                    <!-- <span>|</span> -->
                </div>
                <!-- 版权 -->
                <div class="bq">
                    <!-- &copy; 2021-2021 LWL物流 版权所有 增值业务经营许可证： -->
                    <!-- <a href="" class="h">神ICC备20210901号-6</a> -->
                </div>
                <!-- 公安网 -->
                <!-- <div class="w"><a href="">&sect;神公网 1234567891234567号</a></div> -->
            </nav>
            <!-- 联系方式 -->
            <div class="lxfs">
                <!-- <img src="https://www.jdl.cn/_nuxt/img/phone.7cb4578.png" alt=""> -->
            </div>
        </div>
    </footer>
    
    <!-- 条款模态框 -->
    <section class="mtk">
        <!-- 条款 -->
        <div class="tk">
            <!-- 条款标题 -->
            <h1>LWL快件服务协议</h1>
            <!-- 内容 -->
            <p class="tknr"></p>
            <!-- 关闭按钮 -->
            <button class="gb">关闭</button>
        </div>
    </section>

    <!-- 侧边栏 -->
    <a href="http://wpa.qq.com/msgrd?v=3&uin=524324259&Site=LWl&menu=yes" target="_blank">
        <aside>
            客服
        </aside>
    </a>
    
    <!-- 引用JS -->
    <script src="../../../public/HomePageHeadAndFootStyle/HomePageHeadAndFootJavaScript.js"></script>
    <script src="./MailJavaScript.js"></script>

</body>

</html>
